<template>
  <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :close-on-click-modal="false">
    <div class="app-container">
      <el-row :gutter="6">
        <el-col :span="12">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span class="span">实体分组</span>
            </div>
            <div class="item">
              <dict-group @refreshDicts="onRefreshDicts" @passDict="passDict" :entityeData="entityeData" :tableId="tableId" />
            </div>
          </el-card>

        </el-col>
        <el-col :span="12">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span class="span">[{{ dictGroupName }}]实体数据</span>
            </div>
            <div class="item">
              <dict ref="dict" :distList="distList" />
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>
    <editForm ref="editForm" append-to-body="'true'" @addList="addList"></editForm>
  </el-dialog>
</template>

<script>
import { createcolumn, updatecolumn, getcolumn } from '@/api/metadata/column'
import { labelEntityList, entityTable, addEntiyt, updateEntiyt } from '@/api/metadata/entity'
import editForm from './editForm.vue'
import dictGroup from './child/dictGroup'
import dict from './child/dict'
export default {
  name: 'entityForm',
  components: { editForm, dictGroup, dict },
  data() {
    return {
      labelGroup: [],
      tableKey: 1,
      entityeData: [],
      rules: {},
      temp: {},
      name: '',
      textMap: {
        update: '编辑',
        create: '新建',
      },
      loading: false,
      dialogFormVisible: false,
      delVisible: false, //删除提示框
      index: -1, //删除索引
      dialogStatus: '',
      tableId: '',
      dictGroupName: '',
      distList: [],
    }
  },
  mounted() {},
  methods: {
    passDict(row) {
      this.dictGroupName = row.name
      this.$refs.dict.getList(row, this.tableId)
    },
    onRefreshDicts() {
      labelEntityList({ tableId: this.tableId }).then((res) => {
        if (res.data.code == 200) {
          this.entityeData = res.data.data
          this.dictGroupName = ''
        }
      })
    },
    setList(data) {
      this.tableId = data.tableId
      labelEntityList(data).then((res) => {
        if (res.data.code == 200) {
          this.entityeData = res.data.data
        }
        // console.log(res,'名称列表')
      })
      this.$refs.dict.getList({}, data.tableId)
      // entityTable(data.tableId).then(res => {
      //     // console.log(res,'表数据')
      //     if (res.data.code == 200) {
      //         this.labelGroup = res.data.data.labelGroup || []
      //     }
      // })
    },
    getList() {
      this.$emit('refreshList')
    },
    choseName(id) {
      entityTable(id).then((res) => {
        // console.log(res,'表数据')
        if (res.data.code == 200) {
          this.temp = {
            id: res.data.data.id,
            tableId: res.data.data.tableId,
            name: res.data.data.name,
          }
          this.labelGroup = res.data.data ? res.data.data.labelGroup || [] : []
        }
      })
    },
    addList(data) {
      console.log(data)
      this.labelGroup.push(data)
    },
    createData() {
      this.temp = {
        labelGroup: this.labelGroup,
        name: this.name,
        tableId: this.tableId,
      }
      addEntiyt(this.temp).then((res) => {
        console.log(res, '添加')
        if (res.data.code == 0) {
          this.dialogFormVisible = false
          this.$emit('refreshList')
          this.$message.success(res.data.msg)
        } else {
          this.$message.error(res.data.msg)
        }
      })
    },
    resetTemp() {
      this.loading = false
      this.temp = {
        labelGroup: [],
        name: undefined,
      }
      this.name = ''
    },
    handleCreate() {
      this.resetTemp()
      this.dialogStatus = 'create'
      this.labelGroup = []
      this.dialogFormVisible = true
      // this.$nextTick(() => {
      //     this.$refs['dataForm'].clearValidate()
      // })
    },
    handleAdd() {
      this.$refs.editForm.handleCreate(this.tableId)
    },
    handleDelete(index) {
      this.delVisible = true
      this.index = index
    },
    deleteRow() {
      this.labelGroup.splice(this.index, 1)
      this.delVisible = false
    },
    handleUpdate(id) {
      this.resetTemp()
      this.labelGroup = []
      this.dictGroupName = ''
      this.dialogStatus = 'update'
      this.dialogFormVisible = true
      // this.$nextTick(() => {
      //     this.$refs['dataForm'].clearValidate()
      // })
    },
    updateData() {
      this.temp.labelGroup = this.labelGroup
      this.$refs['dataForm'].validate((valid) => {
        console.log(valid)
        if (valid) {
          this.loading = true
          updateEntiyt(this.temp).then((res) => {
            console.log(res, '更新')
            this.loading = false
            if (res.data.code == 0) {
              this.dialogFormVisible = false
              this.$emit('refreshList')
              this.$message.success(res.data.msg)
            } else {
              this.$message.error(res.data.msg)
            }
          })
        }
      })
    },
  },
}
</script>
<style>
.el-dialog {
  width: 70%;
}
</style>

